<template>
	<view>
		<view v-if="isLandscape" class="hidden-toggle" :class="{ hidden: isHiddenMenu }"
			@click.stop="isHiddenMenu = !isHiddenMenu">
			<image class="hidden-toggle-icon" :class="{ hidden: isHiddenMenu }" src="/static/hidden-menu.png"></image>
		</view>
		<view class="beijingse" :class="[isLandscape ? 'landscape' : 'container']">
			<view class="img-tool" style="left: 20rpx;" @click="searchHandler()">
				<image src="/static/shouye/组 348@1x.png" style="width: 100%; height: 100%"></image>
			</view>
			<view class="img-tool" style="right: 20rpx">
				<image src="/static/shouye/分享@2x.png" style="width: 100%; height: 100%;" @click="fenxiang()"></image>
				<image src="/static/shouye/组 683@2x.png" style="width: 100%; height: 100%; margin-top: -20rpx;"  @click="zhengce = true"></image>
			</view>
			<view v-if="isLandscape == false" id="map" class="map" style="width: 100%; height: 100vh"></view>
			<view v-else id="map" class="map" style="position: absolute; width: 100vh; height: 100vw"
				@touchstart.prevent="handleTouchStart" @touchmove.prevent="handleTouchMove" @touchend="handleTouchEnd">
			</view>
			<view v-if="zhengce == true" style="
          position: absolute;
          top: 230rpx;
          right: 30rpx;
          width: 469rpx;
          border-radius: 20px;
          opacity: 1;
          background: #ffffff;
          z-index: 9999999999999999999999999;
        ">
				
					<image src="/static/shouye/kjzc.png" style="width: 90%; height: 40rpx; margin-top: 20rpx; left: 5%"
						@click="zhengce = false"></image>
				<!-- <view style="font-size: 20rpx; width: 90%; margin-top: 20rpx; margin-left: 5%;"
					v-for="(item,index) in kongjlist" :key="index">
					{{item}}

				</view> -->
				<view style="
            font-size: 20rpx;
            color: #31343b;
            font-family: Source Han Sans;
            width: 90%;
            margin-top: 20rpx;
            margin-left: 5%;
          ">
					一、为企业提供“创业空间—孵化器—加速器—创产用房—主题楼宇（园区）—产业用地”全生命周期的办公空间支持。
					<view>
						1.创业空间。认定为青年创新创业人才及团队的，可申请最高30个办公卡位或“一间办公室”，给予最高三年免租。
					</view>
					<view>
						2.孵化器。对符合条件的初创型企业，入驻孵化器的，可申请最高300平方米的“多间办公室”，给予最高三年免租。
					</view>
					<view>
						3.加速器。对符合条件的成长型企业，入驻加速器的，可申请最高2000平方米的“一层办公楼”的空间支持，第一年免租，第二、第三年最高享受租金三折优惠
					</view>
				</view>
				<view style="
            font-size: 20rpx;
            color: #31343b;
            font-family: Source Han Sans;
            width: 90%;
            margin-top: 5rpx;
            margin-left: 5%;
          ">
					二、在罗湖区购置自用办公用房500平方米以上且符合条件的企业，可按购置金额一定比例给予商办去化支持，分年发放。
				</view>
				<image src="/static/shouye/gdzc.png" style="width: 283rpx; height: 40rpx; margin-top: 20rpx; left: 5%">
				</image>
			</view>
			<!-- <view v-if="!isLandscape" class="header_li">
				<view class="header_li_ledft">
					<view class="fanhui_betns" style="margin-left: 20px; float: right;" @click="zhengce = true">
						<image src="/static/shouye/组 683@2x.png" style="width: 100%; height: 100%;"></image>
					</view>
				</view>
			</view> -->
			<view style="
          width: 100%;
          height: 436rpx;
          float: left;
          margin-top: 50px;
          margin-left: -10%;
        ">
			</view>
			<!-- <view class="header_li" style="margin-top: 30px" v-if="isLandscape == false">
				<view class="header_li_ledft" style="position: relative">
					<view style="
              position: absolute;
              top: -80rpx;
              right: 0rpx;
              height: 80rpx;
              z-index: 9;
            ">
						<view class="fanhui_betns" style="
                margin-right: 7px;
                float: right;
                width: 70rpx;
                height: 70rpx;
                border-radius: 10rpx;
                background: #ffffff;
                display: flex;
                justify-items: center;
                justify-content: center;
              " @click="resetLocation">
							<image src="/static/map/location.png" style="width: 90%; height: 90%; margin-top: 2px"></image>
						</view>
					</view>
					<view class="fanhui_betns" style="margin-left: 20px; float: right" @click="tishikuang()">
						<image src="/static/shouye/组 487@1x.png" style="width: 100%; height: 100%"></image>
					</view>
				</view>
			</view> -->
			<view class="aside-tools" v-if="!isLandscape">
				<view class="aside-tools__wrapper">
					<view class="fanhui_betns" style="
              width: 70rpx;
              height: 70rpx;
              border-radius: 10rpx;
              background: #ffffff;
              display: flex;
              align-items: center;
              justify-content: center;
							box-shadow: 0 0 8px rgba(0, 0, 0, 5%);
            " @click="resetLocation">
						<image src="/static/map/location.png" style="width: 75%; height: 75%;"></image>
					</view>
				</view>
				<!-- <view class="fanhui_betns" @click="tishikuang()">
					<image src="/static/shouye/组 487@1x.png" style="width: 100%; height: 100%"></image>
				</view> -->
				<view @click="toggleOrientation">
					<image src="/static/shouye/qiehuan.png" style="
              width: 100rpx;
              height: 100rpx;
              float: right;
              pointer-events: auto;
            ">
					</image>
				</view>
			</view>
			<view style="position: absolute; left: 20rpx; bottom: 500rpx" v-if="isLandscape == false">
				<view class="header_li_ledft" style="width: 90%; pointer-events: none">
					<view class="ai-button-container" :style="{
						transform: `translate(${aiButton.x}px, ${aiButton.y}px)`,
						transition: aiButton.isDragging ? 'none' : 'transform 0.3s',
					}" @touchstart="handleAiButtonTouchStart" @touchmove="handleAiButtonTouchMove" @touchend="handleAiButtonTouchEnd"
						@touchcancel="handleAiButtonTouchEnd">
						<image src="/static/shouye/ai.png" style="width: 338rpx; height: 80rpx; pointer-events: none"
							v-if="xiaoshi == 0"></image>
						<image src="/static/detail/gbxx.png" style="
                width: 30rpx;
                height: 30rpx;
                position: absolute;
                top: 15rpx;
                right: -30rpx;
                z-index: 9999999;
              " v-if="xiaoshi == 0" @click="xiaoshiai"></image>
					</view>
				</view>
			</view>
			<view v-if="isLandscape" class="landscape-tools">
				<!-- <image src="/static/shouye/分享@2x.png" style="width: 100rpx; height: 100rpx;"  @click="tishikuang()"></image> -->
				<!-- <image src="/static/shouye/组 487@1x.png" style="width: 100rpx; height: 100rpx" @click="tishikuang()"></image> -->
				<image src="/static/shouye/qiehuan.png" style="width: 100rpx; height: 100rpx"
					@click="toggleOrientation">
				</image>
				<view class="ai-button-container" style="
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0;
            width: 100rpx;
            height: 100rpx;
          " :style="{
						transform: `translate(${aiButton.x}px, ${aiButton.y}px)`,
						transition: aiButton.isDragging ? 'none' : 'transform 0.3s',
					}" @touchstart="handleAiButtonTouchStart" @touchmove="handleAiButtonTouchMove" @touchend="handleAiButtonTouchEnd"
					@touchcancel="handleAiButtonTouchEnd">
					<image src="/static/ai1.png" style="width: 70rpx; height: 70rpx"></image>
				</view>
			</view>
			<view v-if="!isLandscape" class="bottom-menu" style="background: #fff; border-radius: 30rpx">
				<view>
					<view style="display: flex">
						<view :class="[index ? 'tab_name' : 'tab_namess']" style="font-family: 'title-font'"
							@click="btnlist(0)">
							<text class="texts">产业</text>
							<text>集聚</text>
						</view>
						<view :class="[index ? 'tab_namess' : 'tab_name']" style="font-family: 'title-font'"
							@click="btnlist(1)">
							<text class="texts">街道</text>
							<text>全景</text>
						</view>
					</view>
					<swiper v-if="index == 0" :current="currentIndexs" :indicator-dots="true" style="height: 360rpx"
						@change="chamges">
						<swiper-item>
							<view style="display: flex; padding-top: 15px">
								<view style="width: 20%; height: 100rpx" @click="tabqieh(0, '金融科技')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 0 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 49@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">金融科技</view>
								</view>
								<view style="width: 20%" @click="tabqieh(1, '高端服务业')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 1 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 43@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">高端服务业</view>
								</view>
								<view style="width: 20%" @click="tabqieh(2, '人工智能')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 2 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 44@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">人工智能</view>
								</view>
								<view style="width: 20%" @click="tabqieh(3, '数字创意')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 3 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 45@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">数字创意</view>
								</view>
								<view style="width: 20%" @click="tabqieh(4, '特色软件')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 4 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 46@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">特色软件</view>
								</view>
							</view>
							<view style="display: flex; padding-top: 15px">
								<view style="width: 20%" @click="tabqieh(5, '大健康')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 5 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 54@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">大健康</view>
								</view>
								<view style="width: 20%" @click="tabqieh(6, '商贸平台')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 6 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 50@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">商贸平台</view>
								</view>
								<view style="width: 20%" @click="tabqieh(7, '现代商贸')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 7 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 51@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">现代商贸</view>
								</view>
								<view style="width: 20%" @click="tabqieh(8, '消费医疗')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 8 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 52@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">消费医疗</view>
								</view>
								<view style="width: 20%" @click="tabqieh(9, '黄金珠宝')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 9 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 53@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">黄金珠宝</view>
								</view>
							</view>
						</swiper-item>
						<swiper-item>
							<view style="display: flex; padding-top: 15px">
								<view style="width: 20%" @click="tabqieh(10, '低空经济')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 10 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 49@1x (1).png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">低空经济</view>
								</view>
								<view style="width: 20%" @click="tabqieh(11, '宠物经济')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 11 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 43@1x (1).png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">宠物经济</view>
								</view>
								<view style="width: 20%" @click="tabqieh(12, '现代时尚')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 12 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 44@1x (1).png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">现代时尚</view>
								</view>
								<view style="width: 20%" @click="tabqieh(13, '现代服务业')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 13 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 45@1x (1).png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">现代服务</view>
								</view>
								<view style="width: 20%" @click="tabqieh(14, '国际咨询')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 14 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 46@1x (1).png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">国际咨询</view>
								</view>
							</view>
							<view style="display: flex; padding-top: 15px">
								<view style="width: 20%" @click="tabqieh(15, '专业服务')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 15 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 56@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">专业服务</view>
								</view>
								<view style="width: 20%" @click="tabqieh(16, '货代物流')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 16 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 52@1x (1).png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">货代物流</view>
								</view>
								<view style="width: 20%" @click="tabqieh(17, '文旅产业')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 17 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 53@1x (1).png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">文旅产业</view>
								</view>
								<view style="width: 20%" @click="tabqieh(18, '保险行业')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 18 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 54@1x (1).png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">保险行业</view>
								</view>
								<view style="width: 20%" @click="tabqieh(19, '工程建筑')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 19 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 55@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">工程建筑</view>
								</view>
							</view>
						</swiper-item>
						<swiper-item>
							<view style="display: flex; padding-top: 15px">
								<view style="width: 20%; height: 100rpx" @click="tabqieh(20, '安全节能')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 20 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 57@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">安全节能</view>
								</view>
								<view style="width: 20%" @click="tabqieh(21, '专精特新')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 21 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 63@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">专精特新</view>
								</view>
								<view style="width: 20%" @click="tabqieh(22, '工程设计')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 22 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 58@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">工程设计</view>
								</view>
								<view style="width: 20%" @click="tabqieh(23, '跨境电商')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 23 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 59@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">跨境电商</view>
								</view>
								<view style="width: 20%" @click="tabqieh(24, '生命健康')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 24 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 60@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">生命健康</view>
								</view>
							</view>
							<view style="display: flex; padding-top: 15px">
								<view style="width: 20%" @click="tabqieh(25, '新材料')">
									<view style="width: 88rpx; height: 80rpx; margin: 0 auto"
										:class="[indexli == 25 ? 'indexname' : '']">
										<image src="/static/shouye/矩形 61@1x.png" style="width: 100%; height: 100%">
										</image>
									</view>

									<view style="font-size: 24rpx; width: 100%; text-align: center">新材料</view>
								</view>
							</view>
						</swiper-item>
					</swiper>
					<view v-else style="height: 360rpx">
						<view style="display: flex; padding-top: 15px">
							<view style="width: 20%; position: relative" @click="jiedaobtn('东门街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 26rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '东门街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 2@2x.png" style="width: 100%; height: 100%">
									</image>
								</view>
								<view style="font-size: 24rpx; width: 100%; text-align: center" :style="{
									color: selectedStreet == '东门街道' ? '#2784F3' : '#3D3D3D',
								}">东门街道</view>
							</view>
							<view style="width: 20%; position: relative" @click="jiedaobtn('莲塘街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 46rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '莲塘街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 3@1x.png" style="width: 100%; height: 100%">
									</image>
								</view>

								<view style="font-size: 24rpx; width: 100%; text-align: center" :style="{
									color: selectedStreet == '莲塘街道' ? '#2784F3' : '#3D3D3D',
								}">莲塘街道</view>
							</view>
							<view style="width: 20%; position: relative" @click="jiedaobtn('翠竹街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 46rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '翠竹街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 4@1x.png" style="width: 100%; height: 100%">
									</image>
								</view>

								<view style="font-size: 24rpx; width: 100%; text-align: center" :style="{
									color: selectedStreet == '翠竹街道' ? '#2784F3' : '#3D3D3D',
								}">翠竹街道</view>
							</view>
							<view style="width: 20%; position: relative" @click="jiedaobtn('桂园街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 46rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '桂园街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 5@1x.png" style="width: 100%; height: 100%">
									</image>
								</view>

								<view style="font-size: 24rpx; width: 100%; text-align: center" :style="{
									color: selectedStreet == '桂园街道' ? '#2784F3' : '#3D3D3D',
								}">桂园街道</view>
							</view>
							<view style="width: 20%; position: relative" @click="jiedaobtn('清水河街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 46rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '清水河街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 6@1x.png" style="width: 100%; height: 100%">
									</image>
								</view>

								<view style="font-size: 24rpx; width: 100%; text-align: center" :style="{
									color:
										selectedStreet == '清水河街道' ? '#2784F3' : '#3D3D3D',
								}">清水河街道</view>
							</view>
						</view>
						<view style="display: flex; padding-top: 15px">
							<view style="width: 20%; position: relative" @click="jiedaobtn('黄贝街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 46rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '黄贝街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 1@1x.png" style="width: 100%; height: 100%">
									</image>
								</view>

								<view style="font-size: 24rpx; width: 100%; text-align: center" :style="{
									color: selectedStreet == '黄贝街道' ? '#2784F3' : '#3D3D3D',
								}">黄贝街道</view>
							</view>
							<view style="width: 20%; height: 100rpx; position: relative" @click="jiedaobtn('南湖街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 46rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '南湖街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 10@1x.png" style="width: 100%; height: 100%">
									</image>
								</view>

								<view style="font-size: 24rpx; width: 100%; text-align: center" :style="{
									color: selectedStreet == '南湖街道' ? '#2784F3' : '#3D3D3D',
								}">南湖街道</view>
							</view>
							<view style="width: 20%; height: 100rpx; position: relative" @click="jiedaobtn('东湖街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 46rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '东湖街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 9@1x.png" style="width: 100%; height: 100%">
									</image>
								</view>

								<view style="font-size: 24rpx; width: 100%; text-align: center" :style="{
									color: selectedStreet == '东湖街道' ? '#2784F3' : '#3D3D3D',
								}">东湖街道</view>
							</view>
							<view style="width: 20%; height: 100rpx; position: relative" @click="jiedaobtn('东晓街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 46rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '东晓街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 8@1x.png" style="width: 100%; height: 100%">
									</image>
								</view>

								<view style="font-size: 24rpx; width: 100%; text-align: center" :style="{
									color: selectedStreet == '东晓街道' ? '#2784F3' : '#3D3D3D',
								}">东晓街道</view>
							</view>
							<view style="width: 20%; height: 100rpx; position: relative" @click="jiedaobtn('笋岗街道')">
								<image src="/static/select_street.png" style="
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 46rpx;
                    left: 0;
                    z-index: -1;
                  " v-if="selectedStreet == '笋岗街道'"></image>
								<view style="width: 88rpx; height: 80rpx; margin: 0 auto">
									<image src="/static/shouye/图层 7@1x.png" style="width: 100%; height: 100%">
									</image>
								</view>

								<view style="font-size: 26rpx; width: 100%; text-align: center" :style="{
									color: selectedStreet == '笋岗街道' ? '#2784F3' : '#3D3D3D',
								}">笋岗街道</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 横屏 -->
			<view v-else class="landscape-menu" :class="{ hidden: isHiddenMenu }"
				style="position: absolute; z-index: 99999999" @touchstart="onTouchStart"
				@touchmove.prevent="onTouchMove" @touchend="onTouchEnd">
				<view class="arrow-button" style="left: 30rpx" @click="prev">
					<image src="/static/shouye/zuo.png" style="
              width: 20rpx;
              height: 20rpx;
              margin-left: 20rpx;
              margin-top: 20rpx;
            "></image>
				</view>

				<swiper class="swiper" style="width: 90%; margin-left: 8%; height: 70px" :indicator-dots="indicatorDots"
					:autoplay="autoplay" :interval="interval" :duration="duration" :current="currentIndex" circular
					disable-touch @change="onSwiperChange">
					<swiper-item style="display: flex;" v-if="index == 0">
						<view style="width: 110rpx; height: 100%; float: left" @click="tabqieh(0, '金融科技')">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 0 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 49@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">金融科技</view>
						</view>
						<view @click="tabqieh(1, '高端服务业')" style="width: 120rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 1 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 43@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">高端服务业</view>
						</view>
						<view @click="tabqieh(2, '人工智能')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 2 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 44@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">人工智能</view>
						</view>
						<view @click="tabqieh(3, '数字创意')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 3 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 45@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">数字创意</view>
						</view>
						<view @click="tabqieh(4, '数字创意')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 4 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 46@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">特色软件</view>
						</view>
						<view @click="tabqieh(5, '大健康')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 5 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 54@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">大健康</view>
						</view>
						<view @click="tabqieh(6, '商贸平台')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 6 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 50@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">商贸平台</view>
						</view>
						<view @click="tabqieh(7, '现代商贸')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 7 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 51@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">现代商贸</view>
						</view>
						<view @click="tabqieh(8, '消费医疗')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 8 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 52@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">消费医疗</view>
						</view>
						<view @click="tabqieh(9, '黄金珠宝')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 9 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 53@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">黄金珠宝</view>
						</view>
					</swiper-item>
					<swiper-item style="display: flex;" v-if="index == 0">
						<view style="width: 110rpx; height: 100%" @click="tabqieh(10, '低空经济')">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 10 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 49@1x (1).png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>
							<view style="text-align: center; width: 100%; font-size: 24rpx">低空经济</view>
						</view>
						<view @click="tabqieh(11, '宠物经济')" style="width: 120rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 11 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 43@1x (1).png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">宠物经济</view>
						</view>
						<view @click="tabqieh(12, '现代时尚')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 2 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 44@1x (1).png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">现代时尚</view>
						</view>
						<view @click="tabqieh(13, '现代服务业')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 13 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 45@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">现代服务</view>
						</view>
						<view @click="tabqieh(14, '国际咨询')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 14 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 46@1x (1).png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">国际咨询</view>
						</view>
						<view @click="tabqieh(15, '专业服务')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 15 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 56@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">专业服务</view>
						</view>
						<view @click="tabqieh(16, '货代物流')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 16 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 52@1x (1).png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">货代物流</view>
						</view>
						<view @click="tabqieh(17, '文旅产业')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 17 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 53@1x (1).png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">文旅产业</view>
						</view>
						<view @click="tabqieh(18, '保险行业')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 18 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 54@1x (1).png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">保险行业</view>
						</view>
						<view @click="tabqieh(19, '工程建筑')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto"
								:class="[indexli == 9 ? 'indexname' : '']">
								<image src="/static/shouye/矩形 55@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">工程建筑</view>
						</view>
					</swiper-item>
					<swiper-item style="display: flex;" v-else>
						<view style="width: 110rpx; height: 100%; float: left" @click="jiedaobtn('东门街道')">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 2@2x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">东门街道</view>
						</view>
						<view @click="jiedaobtn('莲塘街道')" style="width: 120rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 3@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">莲塘街道</view>
						</view>
						<view @click="jiedaobtn('翠竹街道')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 4@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">翠竹街道</view>
						</view>
						<view @click="jiedaobtn('桂园街道')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 5@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">桂园街道</view>
						</view>

						<view @click="jiedaobtn('清水河街道')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 6@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">清水河街道</view>
						</view>
						<view @click="jiedaobtn('黄贝街道')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 1@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">黄贝街道</view>
						</view>
						<view @click="jiedaobtn('南湖街道')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 10@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">南湖街道</view>
						</view>
						<view @click="jiedaobtn('东湖街道')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 9@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">东湖街道</view>
						</view>
						<view @click="jiedaobtn('东晓街道')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 8@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">东晓街道</view>
						</view>
						<view @click="jiedaobtn('笋岗街道')" style="width: 110rpx; height: 100%; margin-left: 10rpx">
							<view style="width: 80rpx; height: 80rpx; margin: 0 auto">
								<image src="/static/shouye/图层 7@1x.png" style="width: 80rpx; height: 80rpx">
								</image>
							</view>

							<view style="text-align: center; width: 100%; font-size: 24rpx">笋岗街道</view>
						</view>
					</swiper-item>
				</swiper>
				<view class="arrow-button" style="right: 30rpx" @click="next">
					<image src="/static/shouye/you.png" style="
              width: 20rpx;
              height: 20rpx;
              margin-left: 20rpx;
              margin-top: 20rpx;
            "></image>
				</view>
			</view>
		</view>
			<image src="/static/fengxiang.png" @click="tishikuangfx = false" style="width: 100%; height: 100vh;position: absolute; z-index: 9999; top: 0; left: 0;" v-if="tishikuangfx == true"></image>
		<street-view @close="streetNameLandscape = null" class="landscape-street-info" :name="streetNameLandscape"
			:landscape="true" v-if="isLandscape && streetNameLandscape"></street-view>
		<uni-popup ref="popup" :mask-click="false">
			<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
				<view class="header_li"> </view>
			</view>
			<view class="header_li">
				<view class="aside-tool" @click="onegb()">
					<view class="fanhui_betns" style="margin-left: 20px">
						<image src="/static/shouye/组 683@2x.png" style="width: 100%; height: 100%"></image>
					</view>
					<view style="
              width: 403rpx;
              height: 220rpx;
              position: absolute;
              right: 20px;
              top: 130px;
            ">
						<image src="/static/yingdao/1.png" style="width: 100%; height: 100%"></image>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="popupa" :mask-click="false">
			<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
				<view class="header_li"> </view>
			</view>
			<view class="header_li" @click="towgb()">
				<view class="header_li_ledft">
					<view style="
              width: 403rpx;
              height: 220rpx;
              position: absolute;
              left: 40px;
              top: 130px;
            ">
						<image src="/static/yingdao/2.png" style="width: 100%; height: 100%"></image>
					</view>
					<view style="
              width: 600rpx;
              height: 396rpx;
              position: absolute;
              left: 60px;
              top: 230px;
            ">
						<image src="/static/yingdao/2.1.png" style="width: 100%; height: 100%"></image>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="popupb" :mask-click="false">
			<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
				<view class="header_li"> </view>
			</view>
			<view class="header_li" @click="seventop()">
				<view class="header_li_ledft">
					<view style="
              width: 403rpx;
              height: 220rpx;
              position: absolute;
              left: 25px;
              top: 380px;
            ">
						<image src="/static/yingdao/3.png" style="width: 100%; height: 100%"></image>
					</view>click
					<view style="
              width: 338rpx;
              height: 80rpx;
              position: absolute;
              left: 25px;
              top: 520px;
            ">
						<image src="/static/yingdao/3.1.png" style="width: 100%; height: 100%"></image>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="popupc" :mask-click="false">
			<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
				<view class="header_li"> </view>
			</view>
			<view class="header_l" @click="clockoner">
				<view class="header_li_ledft">
					<view style="
              width: 403rpx;
              height: 220rpx;
              position: absolute;
              left: 25px;
              top: 500px;
            ">
						<image src="/static/yingdao/4.png" style="width: 100%; height: 100%"></image>
					</view>
					<view style="
              width: 95%;
              height: 407rpx;
              position: absolute;
              left: 2.5%;
              top: 640px;
              z-index: 999999;
            ">
						<image src="/static/yingdao/4.1.png" style="width: 100%; height: 100%"></image>
					</view>
					<view style="
              width: 100%;
              height: 407rpx;
              position: absolute;
              left: 0%;
              top: 640px;
            ">
						<image src="/static/yingdao/4.2.png" style="width: 100%; height: 100%"></image>
					</view>
				</view>
			</view>
		</uni-popup>
		<street-view ref="streetView" :name="streetName" v-if="streetName"></street-view>
		<uni-popup ref="searchPopup" :mask-click="false" type="bottom" style="z-index: 99999999999">
			<search-view @close="closeSearchHandler"></search-view>
		</uni-popup>
	</view>
</template>

<script>
	import {
		streetDatas
	} from './../../components/street-view/data'
	import StreetView from '@/components/street-view/index.vue'
	import SearchView from '@/components/search-view/index.vue'
	export default {
		components: {
			StreetView,
			SearchView,
		},
		data() {
			return {
				lastLngLat: null, // 上一次手指对应的经纬度
				isDragging: false,
				background: ['color1', 'color2', 'color3'],
				indicatorDots: false,
				autoplay: false,
				interval: 2000,
				duration: 500,
				scrollTop: 0,
				currentIndex: 0,
				swiperList: [{
						scrollTop: 0,
					},
					{
						scrollTop: 0,
					},
				],
				old: {
					scrollTop: 0,
				},
				isLandscape: false,
				isHiddenMenu: false,
				index: 0,
				indexli: 0,
				latitude: '22.512289',
				longitude: '114.151471',
				zhengce: false,
				markers: [{
					latitude: 22.512289,
					longitude: 114.151471,
				}, ],
				currentIndexs: 0,
				covers: [
					//  {
					//             	latitude: 22.512289,
					//             	longitude: 114.151471,
					// width:400,
					// height:300,
					//             	iconPath: '/static/detail/dtbj1.png'
					//             },{
					//             	latitude:22.512289,
					//             	longitude: 114.152471,
					// width:380,
					// height:260,
					//             	iconPath: '/static/shouye/dk.png'
					//             }
				],
				scale: 14, // 缩放级别

				status: '',

				kongjlist: '',
				imageLayer: null,
				map: null,
				streetName: null,
				streetNameLandscape: null,
				streetMarker: null,
				type: null,
				selectedStreet: null,
				// AI按钮拖动相关
				aiButton: {
					x: 0,
					y: 0,
					startX: 0,
					startY: 0,
					isDragging: false,
					longPressTimer: null,
				},
				startY: 0,
				step: 0,
				threshold: 50,
				xiaoshi: 0,
				tishikuangfx:false,
			}
		},
		onLoad() {
			// this.list()
			// // 获取空间政策
			this.kongjianzc()
			// //聚集
			// this.jujilist()
		},
		onShow() {
			//监测横屏竖屏 必须配置在onShow()生命周期函数
			// 声明回调函数是为了控制取消监听，不取消也可以直接写在函数内部就好
			this.windowResizeCallback = res => {
				console.log('onWindowResize', res)
				this.status = res.deviceOrientation
				if (this.status == 'landscape') {} else {
					console.log('portrait')
				}
			}
			uni.onWindowResize(this.windowResizeCallback)
			console.log(this.windowResizeCallback, 'ssjjcj')
		},
		methods: {
			fenxiang(){
				this.tishikuangfx = true
				// this.$refs.popupfx.open('center')
			},
			xiaoshiai() {
				this.xiaoshi = 1
			},
			onTouchStart(e) {
				this.startY = e.touches[0].clientY
			},
			onTouchMove(e) {
				const deltaY = e.touches[0].clientY - this.startY

				if (Math.abs(deltaY) < this.threshold) return

				this.step = deltaY < 0 ? 1 : -1
			},
			onTouchEnd() {
				if (!this.currentIndex && this.step < 0) {
					this.currentIndex = 2
				} else if (this.currentIndex === 2 && this.step > 0) {
					this.currentIndex = 0
				} else {
					this.currentIndex += this.step
				}

				this.step = 0
			},
			handleTouchStart(e) {
				if (e.touches.length !== 1) return
				this.lastLngLat = this.getLngLatFromTouch(e.touches[0])
				this.isDragging = true
			},
			handleTouchMove(e) {
				if (!this.isDragging || e.touches.length !== 1) return
				const currentLngLat = this.getLngLatFromTouch(e.touches[0])
				// 计算经纬度差
				let deltaLng = currentLngLat.lng - this.lastLngLat.lng
				let deltaLat = currentLngLat.lat - this.lastLngLat.lat

				// 新的地图中心
				const center = this.map.getCenter()
				const newCenter = [center.lng - deltaLng, center.lat - deltaLat]
				this.map.setCenter(newCenter)
				// 更新 lastLngLat
				this.lastLngLat = currentLngLat
			},
			handleTouchEnd() {
				this.isDragging = false
				this.lastLngLat = null
			},
			// 从触摸点获取经纬度
			getLngLatFromTouch(touch) {
				const y = -touch.clientX
				const x = touch.clientY
				const pixel = new AMap.Pixel(x, y)
				return this.map.containerToLngLat(pixel)
			},
			prev() {
				if (this.currentIndex > 0) {
					this.currentIndex--
				} else {
					this.currentIndex = this.swiperList.length - 1
				}
			},
			next() {
				if (this.currentIndex < this.swiperList.length - 1) {
					this.currentIndex++
				} else {
					this.currentIndex = 0
				}
			},
			onSwiperChange(e) {
				this.currentIndex = e.detail.current
			},
			upper: function(e) {
				console.log(e)
			},
			lower: function(e) {
				console.log(e)
			},
			scroll: function(e) {
				console.log(e)
				this.old.scrollTop = e.detail.scrollTop
			},
			goTop: function(e) {
				// 解决view层不同步的问题
				this.scrollTop = this.old.scrollTop
				this.$nextTick(function() {
					this.scrollTop = 0
				})
				uni.showToast({
					icon: 'none',
					title: '纵向滚动 scrollTop 值已被修改为 0',
				})
			},

			tishikuang() {
				// uni.showToast({
				// 	title: '功能正在开发中...',
				// 	icon: 'none',
				// 	duration: 2000,
				// })
			},
			convertImageToBase64(img) {
				// 创建一个Canvas元素
				var canvas = document.createElement('canvas')
				var ctx = canvas.getContext('2d')

				// 设置Canvas的宽高与图片相同
				canvas.width = img.width
				canvas.height = img.height

				// 将图片绘制到Canvas上
				ctx.drawImage(img, 0, 0)

				// 将Canvas内容转换为Base64编码的URL
				var dataURL = canvas.toDataURL('image/png') // 可以指定图片格式，如'image/jpeg'、'image/png'等
				return dataURL
			},
			resetLocation() {
				this.map.setCenter(new AMap.LngLat(114.152471, 22.51110223))
			},
			jiedaobtn(e) {
				if (this.isLandscape) {
					this.streetNameLandscape = e
					return
				}
				if (this.streetMarker && this.map) {
					this.map.remove(this.streetMarker)
					this.streetMarker = null
				}
				if (this.selectedStreet == e) {
					this.selectedStreet = null
					this.imageLayer.setImageUrl(this.base64Image)
					// this.map.setCenter(new AMap.LngLat(114.15247100, 22.51110223))
					return
				}
				this.selectedStreet = e
				if (this.imageLayer) {
					const data = streetDatas[e]
					if (data) {
						const image = new Image()
						image.onload = e => {
							const base64Url = this.convertImageToBase64(image)
							this.imageLayer.setImageUrl(base64Url)
						}
						image.src = data.imgUrl
						this.streetName = e
						if (this.map) {
							var position = new AMap.LngLat(data.longitude, data.latitude)
							this.map.setZoom(12)
							this.map.setCenter(new AMap.LngLat(data.center[0], data.center[1]))
							this.$nextTick(() => {
								const markerContent = this.$refs.streetView.$el
								this.streetMarker = new AMap.Marker({
									position: position,
									anchor: 'top-left',
									content: markerContent,
									// offset: new AMap.Pixel(data.arrow.offsetX, data.arrow.offsetY)
									offset: new AMap.Pixel(0, 0),
								})
								this.map.add(this.streetMarker)
								console.log(data.center[0], data.center[1])
							})
						}
					}
				}
				// uni.navigateTo({
				// 	url: '/pages/home/home?name=' + e
				// })
			},
			jujilist() {
				this.$rqt.industrytag().then(res => {
					console.log(res.data)
				})
			},
			kongjianzc() {
				this.$rqt.policylist().then(res => {
					this.kongjlist = res.data
				})
			},
			clockoner() {
				this.$refs.popupc.close()
			},

			list() {
				if (datali == '') {
					var datali = uni.getStorageSync('tab')

					var list = JSON.parse(datali)
					var tablist = list.data
					const mapMarks = tablist.map(item => {
						return {
							longitude: item.longitude,
							latitude: item.latitude,
							title: item.title,
							iconPath: '/static/detail/dw.png', // 可自定义标记点(需要注意,必须写成绝对路径,相对路径不生效)
							width: 18, //自定义图标宽
							height: 18, //自定义图标高

							//自定义坐标点内容展示
							callout: {
								content: item.industryTag,
								color: '#ffffff',
								bgColor: '#2A5CAA',
								padding: 6,
								borderRadius: 6,
								display: 'ALWAYS',
								textAlign: 'center',
								fontSize: 12,
							},
						}
					})
					var cov = [{
							latitude: 22.512289,
							longitude: 114.151471,
							width: 400,
							height: 300,
							iconPath: '/static/detail/dtbj1.png',
						},
						{
							latitude: 22.512289,
							longitude: 114.152471,
							width: 340,
							height: 220,
							iconPath: '/static/shouye/dk.png',
						},
						{
							latitude: 22.512289,
							longitude: 114.152471,
							width: 400,
							height: 200,
							iconPath: '/static/detail/1.png',
						},
					]
					this.covers = [...mapMarks, ...cov]
					console.log(mapMarks, 666666)
				} else {
					this.$rqt.buildlist().then(res => {
						console.log(res)

						var tablist = res.data
						const mapMarks = tablist.map(item => {
							return {
								longitude: item.longitude,
								latitude: item.latitude,
								title: item.title,
								iconPath: '/static/detail/dw.png', // 可自定义标记点(需要注意,必须写成绝对路径,相对路径不生效)
								width: 18, //自定义图标宽
								height: 18, //自定义图标高

								//自定义坐标点内容展示
								callout: {
									content: item.industryTag,
									color: '#ffffff',
									bgColor: '#2A5CAA',
									padding: 6,
									borderRadius: 6,
									display: 'ALWAYS',
									textAlign: 'center',
									fontSize: 12,
								},
							}
						})
						var cov = [{
								latitude: 22.512289,
								longitude: 114.151471,
								width: 400,
								height: 300,
								iconPath: '/static/detail/dtbj1.png',
							},
							{
								latitude: 22.512289,
								longitude: 114.152471,
								width: 340,
								height: 220,
								iconPath: '/static/shouye/dk.png',
							},
							{
								latitude: 22.512289,
								longitude: 114.152471,
								width: 400,
								height: 200,
								iconPath: '/static/detail/1.png',
							},
						]
						this.covers = [...mapMarks, ...cov]
						console.log(mapMarks, 666666)
						// uni.setStorageSync('tab', JSON.stringify(res))
					})
				}
			},
			onegb() {
				this.$refs.popup.close()
				this.$refs.popupa.open('top')
			},
			towgb() {
				this.$refs.popupa.close()
				this.$refs.popupb.open('top')
			},
			seventop() {
				this.$refs.popupb.close()
				this.$refs.popupc.open('top')
			},
			toggle(type) {
				this.type = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup.open(type)
			},
			// btnlist(e) {
			// 	console.log(e)
			// 	this.index = e
			// },
			tabqieh(e, name) {
				console.log(e)
				this.indexli = e
				uni.navigateTo({
					url: '/pages/home/home?industryTag=' + name,
				})
			},
			searchHandler() {
				this.$refs.searchPopup.open()
			},
			closeSearchHandler() {
				this.$refs.searchPopup.close()
			},
			// AI按钮拖动事件处理
			handleAiButtonTouchStart(e) {
				const touch = e.touches[0]

				// 横屏模式下需要转换坐标
				if (this.isLandscape) {
					// 横屏时坐标转换:由于页面旋转了90度
					// 原来的 clientX 变成了 clientY,原来的 clientY 变成了 (屏幕宽度 - clientX)
					const screenWidth = window.innerWidth
					this.aiButton.startX = touch.clientY - this.aiButton.x
					this.aiButton.startY = screenWidth - touch.clientX - this.aiButton.y
				} else {
					this.aiButton.startX = touch.clientX - this.aiButton.x
					this.aiButton.startY = touch.clientY - this.aiButton.y
				}

				// 设置长按定时器
				this.aiButton.longPressTimer = setTimeout(() => {
					this.aiButton.isDragging = true
					uni.vibrateShort() // 震动反馈
				}, 500) // 500ms后判定为长按
			},
			handleAiButtonTouchMove(e) {
				if (!this.aiButton.isDragging) {
					return
				}

				const touch = e.touches[0]

				// 横屏模式下需要转换坐标
				if (this.isLandscape) {
					const screenWidth = window.innerWidth
					this.aiButton.x = touch.clientY - this.aiButton.startX
					this.aiButton.y = screenWidth - touch.clientX - this.aiButton.startY
				} else {
					this.aiButton.x = touch.clientX - this.aiButton.startX
					this.aiButton.y = touch.clientY - this.aiButton.startY
				}
			},
			handleAiButtonTouchEnd(e) {
				// 清除长按定时器
				if (this.aiButton.longPressTimer) {
					clearTimeout(this.aiButton.longPressTimer)
					this.aiButton.longPressTimer = null
				}

				// 如果不是拖动状态,则执行点击事件
				if (!this.aiButton.isDragging) {
					this.tishikuang()
				}

				this.aiButton.isDragging = false
			},
		},
	}
</script>
<script module="echarts" lang="renderjs">
	import {
		streetPolygons,
		streetMarkers
	} from './polygon'
	export default {
		data() {
			return {
				lineArrs: [],
				currentIndexs: 0,
				index: 0,
				isLandscape: false,
				base64Image: null
			};
		},
		onshow() {},
		mounted() {
			this.loadImage()

			// 		this.lineArrs = uni.getStorageSync('lineArrs')

			if (window.AMap) {
				// 观测更新的数据在 view 层可以直接访问到
				this.initAmap();
			} else {
				// 动态引入较大类库避免影响页面展示
				const script = document.createElement('script');

				script.src =
					`https://webapi.amap.com/maps?v=2.0&key=ab487eca8c841a28c373ee40ecc58765&plugin=AMap.Autocomplete`; //您申请的key值

				script.onload = () => {

					this.initAmap();
				}
				document.head.appendChild(script);
				// document.head.appendChild(scripta);
				// document.head.appendChild(scripts);
			}
		},

		methods: {
			loadImage() {
				return new Promise((resolve, reject) => {
					const image = new Image()
					image.onload = (e) => {
						const base64Url = this.convertImageToBase64(image)
						this.base64Image = base64Url
						resolve(base64Url)
					}
					image.onerror = (error) => {
						console.error('图片加载失败:', error)
						reject(error)
					}
					image.src = '/industry/static/detail/dtbj3.png'
				})
			},
			resetStreetMap() {
				if (this.streetMarker && this.map) {
					this.map.remove(this.streetMarker)
					this.streetMarker = null
					this.selectedStreet = null
				}
			},
			toggleOrientation() {
				this.resetStreetMap()
				this.isLandscape = !this.isLandscape;
				this.isHiddenMenu = false
				console.log(this.isLandscape)

				// 切换横竖屏时重置AI按钮位置
				this.aiButton.x = 0;
				this.aiButton.y = 0;

				this.isLandscape ? 'landscape' : 'portrait'
				this.initAmap()
			},
			btnlist(e) {
				this.swiperList = []
				if (e == 0) {
					var data = [{
							scrollTop: 0
						}, {
							scrollTop: 0
						},

					]
					this.swiperList = data
				} else {
					var data = [{
							scrollTop: 0
						}

					]
					this.swiperList = data
				}
				this.resetStreetMap()
				console.log(e)
				this.index = e
				this.initAmap()
			},
			chamges(e) {
				console.log(e.detail.current)
				this.currentIndexs = e.detail.current

			},
			addPolygon() {
				streetPolygons.forEach(item => {
					let polygon = new AMap.Polygon({
						path: item.path,
						fillColor: '#ff0000',
						strokeOpacity: 0,
						fillOpacity: 0,
						strokeColor: '#2b8cbe',
						strokeWeight: 1,
						extData: {
							name: item.name
						},
						strokeStyle: 'dashed',
						strokeDasharray: [5, 5],
					});
					polygon.on('click', (e) => {
						const data = e.target.getExtData();
						if (data.name) {
							this.jiedaobtn(data.name)
						}
					})
					this.map.add(polygon);
				})
			},
			addStreetMarkers() {
				streetMarkers.forEach(item => {
					let marker = new AMap.Marker({
						position: item.position,
						anchor: 'top-left',
						icon: new AMap.Icon({
							image: item.icon,
							imageSize: new AMap.Size(76, 48),
						}),
					});
					marker.on('click', (e) => {
						this.jiedaobtn(item.name)
					});
					this.map.add(marker);
				})
			},
			initAmap() {
				if (this.imageLayer) {
					this.map.remove(this.imageLayer)
				}
				if (this.index == 0) {
					this.imageLayer = new AMap.ImageLayer({
						url: '/industry/static/detail/dtbj1.png',
						bounds: new AMap.Bounds(
							[114.07979965, 22.51541137], //左下角
							[114.24213063, 22.61270222] //右上角
						),
						zooms: [10, 16]
					});
				} else {
					this.imageLayer = new AMap.ImageLayer({
						url: this.base64Image || '/industry/static/detail/dtbj2.png',
						bounds: new AMap.Bounds(
							[114.01595661, 22.45541137],
							[114.2998526, 22.657773]
						),
						zooms: [11, 16]
					});
				}


				var markerContent = '' +
					'<div class="custom-content-marker" style="position: relative; width:100rpx; height:30rpx;" >' +
					'   <img src="/industry/static/sy/保险行业.png" style="position: absolute; top:0, width:100rpx; height:30rpx;">' +
					'   ' +
					'</div>';


				const map = new AMap.Map('map', {
					resizeEnable: true,
					center: [114.15247100, 22.51110223],
					zoom: 12,
					layers: [
						//AMap.createDefaultLayer(),
						this.imageLayer

					]
				})
				if (this.map) {
					this.map.destroy();
				}
				this.map = map;

				if (this.index == 0) {
					//if (this.currentIndexs == 0) {//
					var marker = [{
							icon: '/industry/static/sy/大健康.png',
							position: [114.10257013, 22.58969877],
						}, {
							icon: '/industry/static/sy/数字创意.png',
							position: [114.13883751, 22.58945092],
						}, {
							icon: '/industry/static/sy/人工智能.png',
							position: [114.11890361, 22.58442853],
						}, {
							icon: '/industry/static/sy/工程建筑.png',
							position: [114.11710937, 22.57963595],
						},
						{
							icon: '/industry/static/sy/金融科技.png',
							position: [114.10689509, 22.55989995],
						},
						{
							icon: '/industry/static/sy/高端服务业.png',
							position: [114.10599294, 22.54345108],
						},
						{
							icon: '/industry/static/sy/现代商贸.png',
							position: [114.12442402, 22.55537218],
						},
						{
							icon: '/industry/static/sy/消费医疗.png',
							position: [114.12562435, 22.56583442],
						},
						{
							icon: '/industry/static/sy/黄金珠宝.png',
							position: [114.14079941, 22.57799094],
						},
						{
							icon: '/industry/static/sy/保险行业.png',
							position: [114.10989930, 22.56984742],
						},
						{
							icon: '/industry/static/sy/宠物经济.png',
							position: [114.11586479, 22.57436534],
						}, {
							icon: '/industry/static/sy/现代服务.png',
							position: [114.10663743, 22.55387557],
						},
						{
							icon: '/industry/static/sy/国际咨询.png',
							position: [114.10633653, 22.54880211],
						},
						{
							icon: '/industry/static/sy/专业服务.png',
							position: [114.10414765, 22.53913050],
						},
						{
							icon: '/industry/static/sy/文旅产业.png',
							position: [114.12567000, 22.53860716],
						},
						{
							icon: '/industry/static/sy/贷货物流.png',
							position: [114.15755997, 22.57151914],
						},
						{
							icon: '/industry/static/sy/现代时尚.png',
							position: [114.18707238, 22.58135872],
						},
						{
							icon: '/industry/static/sy/低空经济.png',
							position: [114.14028909, 22.59875734],
						},
						{
							icon: '/industry/static/sy/特色软件.png',
							position: [114.10321203, 22.59805059],
						},
						{
							icon: '/industry/static/sy/商贸平台.png',
							position: [114.12802314, 22.56028354],
						},
						{
							icon: '/industry/static/sy/安全节能.png',
							position: [114.15614604, 22.55948867],
						},
						{
							icon: '/industry/static/sy/专精特新.png',
							position: [114.12988185, 22.59368644],
						},
						{
							icon: '/industry/static/sy/工程设计.png',
							position: [114.15275574, 22.59166572],
						},
						{
							icon: '/industry/static/sy/跨境电商.png',
							position: [114.13558959, 22.54430896],
						},
						{
							icon: '/industry/static/sy/生命健康.png',
							position: [114.09426212, 22.58516752],
						},
						{
							icon: '/industry/static/sy/新材料.png',
							position: [114.08735275, 22.59325060],
						},
						{
							icon: '/industry/static/sy/生命健康.png',
							position: [114.11422232, 22.53452097],
						},
						{
							icon: '/industry/static/sy/人工智能.png',
							position: [114.14216987, 22.59447884],
						},
						{
							icon: '/industry/static/sy/现代时尚.png',
							position: [114.13344383, 22.59705425],
						},
						{
							icon: '/industry/static/sy/黄金珠宝.png',
							position: [114.14996623, 22.59578638],
						},
						{
							icon: '/industry/static/sy/低空经济.png',
							position: [114.12580490, 22.58485052],
						},
						{
							icon: '/industry/static/sy/数字创意.png',
							position: [114.12425995, 22.58025403],
						},
						{
							icon: '/industry/static/sy/金融科技.png',
							position: [114.12288666, 22.57597440],
						},
						{
							icon: '/industry/static/sy/现代服务.png',
							position: [114.12099838, 22.57066431],
						},
						{
							icon: '/industry/static/sy/文旅产业.png',
							position: [114.13215637, 22.58334479],
						},
						{
							icon: '/industry/static/sy/安全节能.png',
							position: [114.12966728, 22.57898601],
						}
					];
					// 添加一些分布不均的点到地图上,地图上添加三个点标记，作为参照
					marker.forEach(function(marker, index) {
						var markes = new AMap.Marker({
							map: map,
							icon: new AMap.Icon({
								image: marker.icon,
								imageSize: new AMap.Size(76, 48),
							}),
							position: [marker.position[0], marker.position[1]],
							offset: new AMap.Pixel(-13, -30),
							imageSize: new AMap.Size(35, 20),
						});
						markes.on('click', function(e) {
							console.log(index)

							if (index == 4) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=金融科技'
								})
							} else if (index == 0) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=大健康'
								})
							} else if (index == 1) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=数字创意'
								})
							} else if (index == 2) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=人工智能'
								})
							} else if (index == 3) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=工程建筑'
								})
							} else if (index == 5) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=高级服务业'
								})
							} else if (index == 6) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=现代商贸'
								})
							} else if (index == 7) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=消费医疗'
								})
							} else if (index == 8) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=黄金珠宝'
								})
							} else if (index == 9) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=保险行业'
								})
							} else if (index == 14) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=文旅产业'
								})
							} else if (index == 10) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=宠物经济'
								})
							} else if (index == 11) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=现代服务业'
								})
							} else if (index == 12) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=国际咨询'
								})
							} else if (index == 13) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=专业服务'
								})
							} else if (index == 15) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=货代物流'
								})
							} else if (index == 16) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=现代时尚'
								})
							} else if (index == 17) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=低空经济'
								})
							} else if (index == 18) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=特色软件'
								})
							} else if (index == 19) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=商贸平台'
								})
							} else if (index == 20) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=安全节能'
								})
							} else if (index == 21) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=专精特新'
								})
							} else if (index == 22) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=工程设计'
								})
							} else if (index == 23) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=跨境电商'
								})
							} else if (index == 24) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=生命健康'
								})
							} else if (index == 25) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=新材料'
								})
							} else if (index == 26) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=生命健康'
								})
							} else if (index == 27) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=人工智能'
								})
							} else if (index == 28) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=现代时尚'
								})
							} else if (index == 29) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=黄金珠宝'
								})
							} else if (index == 30) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=低空经济'
								})
							} else if (index == 31) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=数字创意'
								})
							} else if (index == 32) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=金融科技'
								})
							} else if (index == 33) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=现代服务业'
								})
							} else if (index == 34) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=文旅产业'
								})
							} else if (index == 35) {
								uni.navigateTo({
									url: '/pages/home/home?industryTag=安全节能'
								})
							}


						})
					});
				}
				if (this.isLandscape == false) {

					this.map.on('click', (e) => {
						// console.log(e.lnglat.getLng() + "," + e.lnglat.getLat())
						// console.log(this.map.getCenter())
						list.push([e.lnglat.getLng(), e.lnglat.getLat()])
						console.log(list)
					})
					if (this.index == 1) {
						var marker = []
						this.addPolygon()
					}


				} else {
					this.map.setCenter([114.162645, 22.559357]);
					this.map.setStatus({
						dragEnable: false
					});
					if (this.index == 1) {
						this.addStreetMarkers()
					}
				}
				const list = []

				// var position = new AMap.LngLat(114.132471, 22.572289);

				// const marker = new AMap.Marker({
				// 	map: map,
				// 	 cursor: 'pointer' ,
				// 	position:position,
				// 	 content: markerContent,
				// 	url: 'https://a.amap.com/jsapi_demos/static/data3d/single.json', // 3d Tiles 入口文件
				// 	style: {
				// 		light: {
				// 			color: 'rgb(44,59,75)', // 设置光照颜色
				// 			intensity: 2, // 设置光照强度
				// 		},
				// 	},
				// });


				// marker.setMap(map);

				// marker.on('moving', function(e) {
				// 	passedPolyline.setPath(e.passedPath);
				// });

				// map.setFitView();

				this.marker = marker;

			},
			startAnimation() {
				const marker = this.marker;
				marker.moveAlong(this.lineArrs, 10);
			},
			pauseAnimation() {
				const marker = this.marker;
				marker.pauseMove();
			},
			resumeAnimation() {
				const marker = this.marker;
				marker.resumeMove();
			},
			stopAnimation() {
				const marker = this.marker;
				marker.stopMove();
			}
		},
	};
</script>

<style lang="scss" scoped>
	page {
		background: #f4f4f4;
	}

	//高德地图-logo隐藏
	// /deep/.amap-logo {
	//   display: none;
	//   opacity: 0 !important;
	// }
	//高德地图-版权隐藏
	.amap-copyright {
		opacity: 0;
	}

	.input-card {
		position: fixed;
		bottom: 7%;
		width: 100%;
	}

	.input-item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 32rpx;
	}
</style>
<style>
	.beijingse {
		position: relative;
		width: 100%;
		height: 65vh;
		transition: transform 500ms;
		overflow: hidden;
	}

	.header_li {
		width: 100%;
		height: 100rpx;
		float: left;
	}

	.header_li_ledft {
		width: 90%;
		margin-left: 5%;
		float: left;
	}

	.fanhui_betn {
		width: 76rpx;
		height: 76rpx;
		float: left;
		background: #fff;
		border-radius: 5px;
		margin-top: 10rpx;
	}

	.img_fanbtn {
		width: 32rpx;
		height: 32rpx;
		float: left;
		margin-top: 23rpx;
		margin-left: 23rpx;
	}

	.fanhui_betns {
		width: 100rpx;
		height: 100rpx;
		float: left;
		border-radius: 5px;
	}

	.img-tool {
		position: absolute;
		z-index: 9;
		width: 100rpx;
		height: 100rpx;
		top: 20rpx;
	}

	.tab_name {
		width: 50%;
		height: 77rpx;
		float: left;
		text-align: center;
		line-height: 77rpx;
		font-size: 38rpx;
		font-weight: 500;
		color: #a2a2a2;
		border-bottom-right-radius: 100px;
	}

	.tab_namess {
		width: 50%;
		height: 77rpx;
		/* float: left; */
		text-align: center;
		line-height: 77rpx;
		font-size: 38rpx;
		font-weight: 500;
		background: #f4f7ff;
		border-bottom-right-radius: 100px;
	}

	.tab_namess .texts {
		color: #237ef0;
	}

	.indexname {
		border: 1px solid #237ef0;
		border-radius: 100rpx;
	}

	.container {
		width: 100vw;
		height: 100vh;
		/* transition: all 0.3s; */
		overflow-x: hidden;
	}

	.landscape {
		transform: rotate(90deg) translate(calc(50vh - 50vw), calc(50vh - 50vw));
		transform-origin: center center;
		width: 100vh;
		height: 100vw;
	}

	.landscape-street-info {
		transform: rotate(90deg);
		transform-origin: center center;
		opacity: 1 !important;
		position: absolute;
		right: 20px;
		bottom: 20px;
		z-index: 9999999999999999;
	}

	.scroll-Y {
		height: 20vh;
	}

	.scroll-view_H {
		white-space: nowrap;
		width: 100%;
	}

	.scroll-view-item {
		height: 20vh;
		line-height: 20vh;
		text-align: center;
		font-size: 36rpx;
	}

	.scroll-view-item_H {
		width: 100%;
		height: 20vh;
	}

	.amap-marker>.amap-icon>img {
		width: 100px !important;
	}

	.hidden-toggle {
		position: fixed;
		z-index: 999;
		top: 50%;
		left: 2%;
		color: #000;
		transform: rotate(90deg) translateX(-50%);
	}

	.hidden-toggle-icon {
		width: 45rpx;
		height: 45rpx;
		transition: transform 500ms;
	}

	.hidden-toggle-icon.hidden {
		transform: rotate(180deg);
	}

	.landscape-menu {
		position: absolute;
		bottom: 60rpx;
		display: flex;
		align-items: center;
		background-color: transparent;
		transform-origin: 0 100%;
		width: 100%;
		padding: 0 30rpx;
		box-sizing: border-box;
		transition: bottom 500ms, opacity 500ms;
	}

	.landscape-tools {
		position: absolute;
		top: 20rpx;
		right: 120rpx;
		display: flex;
		flex-direction: row-reverse;
		max-width: 300rpx;
	}

	.arrow-button {
		position: absolute;
		height: 60rpx;
		width: 60rpx;
		background: #fff;
		border-radius: 50%;
		z-index: 99999999;
	}

	.landscape-menu.hidden {
		opacity: 0;
		bottom: -70px;
		/* transform: translateY(100%); */
	}

	.ai-button-container {
		position: relative;
		z-index: 9999;
		cursor: move;
		user-select: none;
		-webkit-user-select: none;
		touch-action: none;
		/* padding: 40rpx; */
		pointer-events: auto;
	}

	.bottom-menu {
		position: fixed;
		z-index: 99;
		box-shadow: 0 0 12px rgba(0, 0, 0, 5%);
		left: 30rpx;
		right: 30rpx;
		bottom: 40rpx;
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		overflow: hidden;
	}

	.aside-tools {
		position: absolute;
		top: 50%;
		display: flex;
		flex-direction: column;
		right: 20rpx;
		transform: translateY(-50%);
	}

	.aside-tools__wrapper {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100rpx;
		height: 100rpx;
	}
</style>